<template>
  <div>
    <el-form :inline="true" :model="form" class="demo-form-inline">
      <el-row>
        <el-form-item>
          <el-input v-model="form.hosphital" placeholder="请输入昵称/医院"></el-input>
        </el-form-item>
        <el-form-item>
          <el-button type="primary" @click="onSubmit">查询</el-button>
        </el-form-item>
      </el-row>
      <el-row class="action">
        <el-button type="primary" @click="onExport">下载模板</el-button>
        <el-button type="primary" @click="onImport">导入</el-button>
        <el-button type="primary" @click="onAdd">新建</el-button>

        <input
          ref="import"
          style="display: none"
          type="file"
          @change="onFileChange"
          @click="onInputClick"
        />
      </el-row>
    </el-form>
  </div>
</template>

<script>
import apis from '@/api/skinDisease/final/finalApis.js'
export default {
  data() {
    return {
      form: {
        user: '',
        pass: '',
        hosphital: ''
      },
      file: undefined
    }
  },
  watch: {
    editRow: {
      handler(data) {
        this.modalForm = {
          ...this.modalForm,
          id: data.id,
          nickName: data.nickName,
          hospitalName: data.hospitalName,
          phone: data.phone,
          grade: data.grade,
          certificateId: data.certificateId,
          certificateName: data.certificateName
        }
      },
      deep: true
    }
  },
  methods: {
    onExport() {
      apis.flExportTemp().then(res => {
        console.log('res', res)
        window.open(res.data)
      })
    },
    onImport() {
      this.$refs.import.click()
    },
    onInputClick(e) {
      e.target.value = ''
    },
    onFileChange(e) {
      if (!e.target.files[0]) {
        this.$message.warning('请选择文件')
        return
      }
      const formData = new FormData()
      formData.append('file', e.target.files[0])
      apis.flParExport(formData).then(() => {
        this.$message.success('导入成功')
      })
    },
    onSubmit() {
      this.$emit('onSubmit', this.form)
    },
    onAdd() {
      this.$emit('onAdd')
    },


  },

}
</script>

<style scoped>
.action {
  margin-bottom: 20px;
}
</style>
